import { View, TouchableOpacity, Text, StyleSheet, Alert, Image } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import { MaterialIcons } from '@expo/vector-icons';
import { Link, router } from 'expo-router';
import * as FileSystem from "expo-file-system";
import { FFmpegKit } from 'ffmpeg-kit-react-native';


async function copyWatermarkToDocuments() {
  const watermarkUri = Image.resolveAssetSource(
    require("../assets/images/favicon.png")
  ).uri;
  const localPath = `${FileSystem.documentDirectory}favicon.png`;
  Alert.alert('FFmpeg overlay:', `${watermarkUri} sss ${localPath}`);  // 成功则输出 FFmpeg 版本信息
  await FileSystem.downloadAsync(watermarkUri, localPath);
  return localPath;
}


export default function HomeScreen() {
  const runFFmpeg = async () => {
    const session = await FFmpegKit.execute('-version');
    const output = await session.getOutput();
    Alert.alert('FileSystem', JSON.stringify(FileSystem))

    // FFmpegKit.execute("-filters").then(session => {
    //   session.getOutput().then(output => {
    //     // console.log("支持的滤镜:", output.includes("drawtext"));
    //     // Alert.alert('FFmpeg filters:', output);  // 成功则输出 FFmpeg 版本信息
    //     console.log("是否支持 overlay:", output.includes("overlay"));
    //     console.log("是否支持 scale:", output.includes("scale"));
    //     Alert.alert('FFmpeg overlay:', output.includes("overlay") ? '1' : '2');  // 成功则输出 FFmpeg 版本信息
    //   });
    // });
    // 查看 FFmpeg 版本（确认是否支持 libx264/libx265）
    FFmpegKit.execute(`-version`).then((session) => {
      session.getOutput().then((output) => {
        console.log("FFmpeg version info:", output);
        Alert.alert('FFmpeg version info:', output);  // 成功则输出 FFmpeg 版本信息
      });
    });

    // FFmpegKit.execute(`-buildconf`).then((session) => {
    //   session.getOutput().then((output) => {
    //     console.log("Build configuration:", output);
    //     Alert.alert('Build configuration:', output);  // 成功则输出 FFmpeg 版本信息
    //   });
    // });

    // // 检查支持的编解码器和参数
    // FFmpegKit.execute('-encoders').then(session => {
    //   const output = session.getOutput();
    //   console.log(output);
    //   Alert.alert('-encoders:', JSON.stringify(output));  // 成功则输出 FFmpeg 版本信息
    // });

  };

  // runFFmpeg();
  // copyWatermarkToDocuments()

  const onClick = () => {
    router.push('/tools')
  }

  return (
    <SafeAreaView edges={['top']} style={styles.container}>
      <View >
        <View>
          <Text style={{ color: "#000", fontSize: 28, fontWeight: "bold" }}>工具</Text>
        </View>
        <TouchableOpacity style={styles.toolsBox} onPress={onClick}>
          <View >
            <Text style={{ color: "white", fontSize: 22, fontWeight: "bold" }}>视频处理</Text>
            <Text style={{ color: "white", fontSize: 18, marginTop: 8 }}>降低重复度和MD5</Text>
          </View>
          <View >
            <MaterialIcons name="videocam" size={48} color="white" />
          </View>
        </TouchableOpacity>
      </View>
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  // 复用之前的样式
  container: {
    flex: 1,
    padding: 20,
    backgroundColor: '#fff',
  },
  toolsBox: {
    marginTop: 30,
    backgroundColor: "#5d5ce5",
    padding: 20,
    borderRadius: 8,
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between'
  },
});